<script setup>
import {getArticleCategoryList} from "@/api/article.js";
import {ref} from "vue";

defineProps({
	modelValue: {
		type: [Number, String]
	},
	width: {
		type: String
	}
})

const emit = defineEmits(['update:modelValue'])

const channelList = ref([])
const getChannelList = async () => {
	const res = await getArticleCategoryList()
	channelList.value = res.data.records
}
getChannelList()
</script>

<template>
	<el-select style="width: 150px"
	           :modelValue="modelValue"
	           :style="{width}"
	           @update:modelValue="emit('update:modelValue', $event)"
	>
		<!-- label是展示给用户看的，value是提交给后台的 -->
		<el-option v-for="item in channelList" :key="item.id"
		           :label="item.cateName"
		           :value="item.id"></el-option>
	</el-select>
</template>

<style scoped>

</style>